<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
	</head>
	<body>
		<div id="app">
			<h1>插值表达式</h1>
			<p>会把模型中的数据填充进来</p>
			<div>{{msg}}</div>
			<div>{{obj.id}},{{obj.name}},{{obj.age}}</div>
			<div>{{obj.id+','+obj.name+','+obj.age}}</div>
			<div>{{foo()}}</div>
			<div>{{m>n?m:n}}</div>
			
			
			
		</div>

		<script>
			const vm = Vue.createApp({
				data() {
					return {
						msg: "Hello Vue!",
						name: "张三",
						obj:{
							id:1,
							name:"王五",
							age:18
						},
						foo:function(){
							return 100*100;
						},
						m: 10,
						n: 20
					}
				}
			})
			vm.mount("#app");
		</script>
	</body>
</html>
